{% extends "admin/manager.html" %}

{% block app_content %}
<div class="container mb-4"></div>
<h1 class="display-6" align="center">课程管理</h1>
<div class="container mb-4"></div>

<!-- 查询表单 -->
<form id="courseSearchForm" class="form-inline mb-4">
    <input type="text" id="courseSearchTerm" class="form-control mr-2" placeholder="输入课程名称">
    <button type="button" class="btn btn-primary" onclick="searchCourse()">查询</button>
</form>

<div class="container">
    <div class="row">
        <div class="col-md-5">
            <h3 align="center">创建课程</h1>
            <br>
            <form action="/add_course" method="POST">
                <div class="row">
                    <div class="col-md-6">
                        <div class="form-group">
                            <label>课程号</label>
                            <input type="number" name="CourseNum" class="form-control" placeholder="课程号" required>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="form-group">
                            <label>课程名</label>
                            <input type="text" name="CourseName" class="form-control" placeholder="课程名" required>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-6">
                        <div class="form-group">
                            <label>课程学分</label>
                            <select type="number" name="CourseCredit" class="form-control custom-select" placeholder="课程学分" required>
                                <option>0.5</option>
                                <option>1</option>
                                <option>2</option>
                                <option>3</option>
                                <option>4</option>
                                <option>5</option>
                            </select>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="form-group">
                            <label>课程学时</label>
                            <input type="number" name="CourseTime" class="form-control" placeholder="课程学时" required>
                        </div>
                    </div>
                </div>
                <div class="form-group">
                    <label>开课学院</label>
                    <select type="text" name="DeptName" class="form-control custom-select" placeholder="学院名" required>
                        {% if info %}
                        {% for dept in info.depts %}
                        <option>{{ dept }}</option>
                        {% endfor %}
                        {% else %}
                        <option>无学院信息，请录入</option>
                        {% endif %}
                    </select>
                </div>
                <div class="form-group">
                    <label>课程描述</label>
                    <textarea name="CourseDesc" class="form-control" rows="3"></textarea>
                </div>
                <button type="submit" class="btn btn-success btn-block">创建课程</button>
            </form>
        </div>
        <div class="col-md-2"></div>
        <div class="col-md-5">
            <h3 align="center">教师开设课程</h1>
            <br>
            <form action="/add_course_teacher" method="POST">
                <div class="form-group">
                    <label>课程名</label>
                    <select type="text" name="CourseName" class="form-control custom-select" placeholder="课程名" required>
                            {% if info %}
                            {% for course in info.courses %}
                            <option>{{ course }}</option>
                            {% endfor %}
                            {% else %}
                            <option>无课程信息，请录入</option>
                            {% endif %}
                        </select>
                </div>
                <div class="form-group">
                    <label>教师名</label>
                    <select type="text" name="TeacherName" class="form-control custom-select" placeholder="教师名" required>
                            {% if info %}
                            {% for teacher in info.teachers %}
                            <option>{{ teacher }}</option>
                            {% endfor %}
                            {% else %}
                            <option>无教师信息，请录入</option>
                            {% endif %}
                        </select>
                    </div>
                <div class="form-group">
                    <label>课程容量</label>
                    <input type="number" name="CourseCapacity" class="form-control" placeholder="课程容量" required>
                </div>
                <button type="submit" class="btn btn-success btn-block">开设课程</button>
            </form>
        </div>
    </div>
    <div class="container mb-4"></div>
    <div class="row">
        <table class="table table-striped table-hover" id="courseTable">
            <thead class="thead-dark">
                <tr>
                    <th class="lead">课程号</th>
                    <th class="lead">课程名</th>
                    <th class="lead">课程学分</th>
                    <th class="lead">课程学时</th>
                    <th class="lead">开课学院</th>
                    <th class="lead">教师号</th>
                    <th class="lead">教师名</th>
                    <th class="lead">课程管理</th>
                    <th class="lead">操作</th>
                </tr>
            </thead>
            <tbody>
                {% for course in courses %}
                <tr>
                    <td class="lead">{{ course.CourseNum }}</td>
                    <td><input type="text" value="{{ course.CourseName }}" class="form-control" id="name-{{ course.CourseNum }}"></td>
                    <td class="lead">{{ course.CourseCredit }}</td>
                    <td class="lead">{{ course.CourseTime }}</td>
                    <td class="lead">{{ course.dept.DeptName }}</td>
                    <td class="lead">
                        {% if course.Teachers %}
                            {% for teacher in course.Teachers %}
                                {{ teacher.TeacherNum }}<br>
                            {% endfor %}
                        {% endif %}
                    </td>
                    <td class="lead">
                        {% if course.Teachers %}
                            {% for teacher in course.Teachers %}
                                {{ teacher.TeacherName }}<br>
                            {% endfor %}
                        {% endif %}
                    </td>
                    <td class="lead">
                        <a href="{{ url_for('course_delete', CourseNum=course.CourseNum) }}" class="btn btn-outline-danger btn-sm" role="button">删除课程</a>
                    </td>
                    <td><button class="btn btn-success" onclick="updateCourse('{{ course.CourseNum }}')">保存</button></td>
                </tr>
                {% endfor %}
            </tbody>
        </table>
    </div>
</div>

<script>
function updateCourse(courseNum) {
    const name = document.getElementById(`name-${courseNum}`).value;

    fetch(`/update_course/${courseNum}`, {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json'
        },
        body: JSON.stringify({ name })
    })
    .then(response => response.json())
    .then(data => {
        if (data.success) {
            alert('更新成功');
        } else {
            alert('更新失败');
        }
    })
    .catch(error => console.error('Error:', error));
}
</script>
{% endblock %}